<template>
  <div>
    <h2 class="b-title">
      最新知识
      <span>Hot Knowledge</span>
    </h2>

    <ul class="hot-knowledge">
      <li v-for="item in list">
        <span :class="getClassType(item.type)">{{item.type}}</span>
        <a target="_blank" :href="item.href">{{item.name}}</a>
      </li>
    </ul>
  </div>
</template>

<script>
  export default {
    name: 'hotKnowledge',
    data () {
      return {
        msg: 'this is a test message.'
      }
    },
    computed: {
      list () {
        return this.$store.state.home.hotKnowledge
      }
    },
    methods: {
      getClassType (type) {
        switch (type) {
          case 'Page': return 'type1'
          case 'Doc': return 'type2'
          case 'WIKI': return 'type3'
          case 'FAQ': return 'type4'
          default: return 'type1'
        }
      }
    }/* ,
    //单个组件请求时可以这样使用
    created () {
      this.$store.dispatch(getHotKnowledge)
    } */
  }
</script>

